<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>编辑文章</title>
		<link rel="stylesheet" href="../../resources/layui/css/layui.css" />
		<link rel="stylesheet" href="../../resources/css/articledit.css" />
		<script type="text/javascript" src="../../resources/js/jquery-1.11.1.min.js"></script>
		<script type="text/javascript" src="../../resources/js/moxie.js"></script>
		<script type="text/javascript" src="../../resources/js/plupload.full.min.js"></script>
		<script type="text/javascript" src="../../resources/js/qiniu.js"></script>
		<script type="text/javascript" src="../../resources/layui/layui.js"></script>
	</head>

	<body>
		<div class="main">

			<form class="layui-form" action="">
				<div class="layui-form-item">
					<label class="layui-form-label">文章标题</label>
					<div class="layui-input-block">
						<input type="text" name="title" lay-verify="artcletitle" placeholder="请输入标题" class="layui-input" value="前端性能优化：细说JavaScript的加载与执行 前端开发">
					</div>

				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">文章缩略图</label>
					<div class="layui-input-block">
						<div id="btn-uploader">
							<span id="pickfiles" class="layui-btn layui-btn-normal" >选择文件</span>
							<div class="layui-progress layui-progress-big" lay-filter="demo" lay-showPercent="true" style="background:white;position:absolute;top:9px;width: 690px;margin-left: 100px;">
								<div class="layui-progress-bar" lay-percent="0%"></div>
							</div>
						</div>
					</div>

					<div>
						<img src="" class="q_img" style="width: 200px;height: 130px;display:none;margin-left: 109px;margin-top: 10px;" />
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">文章分类</label>
					<div class=" layui-inline">
						<!-- lay-verify="required  用于更新渲染"-->
						<!--form.render();-->
						<!--用于更新渲染-->
						<select name="articlebigtype">
							<option value="0">前端开发</option>
							<option value="1">后端开发</option>
						</select>

					</div>
					<div class="layui-inline">
						<select name="articlesmalltype">
							<option value="0">html</option>
							<option value="1">css</option>
							<option value="1">java</option>
							<option value="1">ruby</option>
						</select>

					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">是否显示</label>
					<div class="layui-input-block">
						<input type="checkbox" checked="" name="switch" lay-skin="switch">
					</div>
				</div>
				<!--富文本编辑器-->
				<div id="txtarea" style="width: 860px;margin-left: 40px;"></div>

				<div class="layui-form-item">
					<div class="layui-input-block btn">
						<button class="layui-btn layui-btn-danger" lay-submit>立即更新</button>
					</div>
				</div>
			</form>

		</div>
		<!--表单验证-->
		<script>
		</script>
		<script type="text/javascript" src="../../resources/layui/layui.js"></script>
		<script>
			layui.use('form', function() {
				var form = layui.form;
				form.verify({
					artcletitle: function(value, item) {
						if(value == "" || /^\s+$/g.test(value)) {
							return '标题不能为空或空格';
						}

					}
				});
			});
		</script>
		<jsp:include page="/pages/common/editor.html"></jsp:include>
		<script type="text/javascript">
			$(document).ready(function() {
				getTokenMessage();
			});

			function getTokenMessage() {
				$.ajax({
					url: '/qiniu/fileUplaod.action',
					type: 'POST',
					data: {},
					cache: false,
					contentType: false, //不可缺
					processData: false, //不可缺
					dataType: 'json',
					success: function(data) {
						//						alert(data.uptoken);
						var obj = data;
						uploaderReady(obj.uptoken);
					}
				});
			}
		</script>
		<script type="text/javascript" src="../../resources/js/qiniuUpload.js"></script>

	</body>

</html>